
<!DOCTYPE HTML>
<html>
<head>
    <link rel="icon" href="../html/img/favicon.ico"/>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">
    <!--<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>-->
    <link rel="stylesheet" href="../html/css/main.css" />
    <script src="../html/jQuery/jquery-min.js"></script>
    <script src="../html/jQuery/skel.min.js"></script>
    <script src="../html/jQuery/main.js"></script>
    <title>一丢丢智能环保</title>
</head>
<body>
<div id="page-wrapper">
    <header class="header-topbar" data-v-1601829a data-v-555f7300>
        <div class="topbar-container clearfix" data-v-1601829a>
            <ul class="tabs-item" data-v-1601829a> <!--target="websiteIframe"-->
                <li class="active"  data-v-1601829a><a href="/">首页</a>
                </li>
                <li data-v-1601829a><a href="/feedback">联系我们</a>
                </li>
                <li data-v-1601829a><span onclick="ShowDiv('MyDiv','fade')">关注我们</span>
                </li>
            </ul>
        </div>
    </header>

    <div id="wrapper">
        <span style="z-index: -1;">一丢丢只能分类垃圾箱</span>
        <section class="panel spotlight medium right" id="first">
            <div class="image filtered tinted img0" data-position="top left" id="img05">
                    <div id="box2" class="up" style="width:50%"><img src="../html/img/457855.png"/></div>
                    <!--<div id="box1" style="width:50%;margin-left: 50%; margin-top: -40%;">

                    </div>-->
            </div>
        </section>

        <% for (let index in data) {
        %>
        <section class="panel spotlight medium right" id="first">
            <div class="image filtered tinted img0" data-position="top left"  id="img<%= data[index].product_name%>">
            </div>
        </section>
        <% } %>
    </div>
    <footer class="bottom">
        <a href="http://www.beian.miit.gov.cn/">
            <center><span style="color:#fff;font-size:14px;">备案号：豫ICP备16042009号</span></center>
        </a>
    </footer>
    <div id="fade" class="black_overlay">
   </div>
    <div id="MyDiv" class="white_content">
        <div style="text-align: right; cursor: default; height: 40px;">
            <span style="font-size: 16px;" onclick="CloseDiv('MyDiv','fade')"><i class="iconfont">&#xe60b;</i></span>
        </div>
        <center style="    margin-top: 6%;">
        <img src="../html/img/weixin.jpg" onclick="CloseDiv('MyDiv','fade')" width="35%;" height="80%"/>
        </center>
    </div>

</div>
<script type="text/javascript">
    function ShowDiv(show_div,bg_div){
        document.getElementById(show_div).style.display='block';
        document.getElementById(bg_div).style.display='block' ;
        var bgdiv = document.getElementById(bg_div);
        bgdiv.style.width = document.body.scrollWidth;
// bgdiv.style.height = $(document).height();
        $("#"+bg_div).height($(document).height());
    };
    //关闭弹出层
    function CloseDiv(show_div,bg_div)
    {
        document.getElementById(show_div).style.display='none';
        document.getElementById(bg_div).style.display='none';
    };

    $(function() {
        $.ajax({
            type: "GET",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "/index" ,//url
            data: {action_type: 'get_product_list'},
            success: function (result) {
                for(var i=0;i<result.data.length;i++){
                    let aa=i+1;
                    if(i>=9){
                        $("#img首页-产品" + (aa)).css({"background-image":"url('"+result.data[i].product_img+"')"});
                    }else{
                        $("#img首页-产品0" + (aa)).css({"background-image":"url('"+result.data[i].product_img+"')"});
                    }
                }
               /* result.data.forEach((currentValue, index, arr)=>{
                    alert(index);
                    if(index>=9){
                        $("#img首页-产品" + (++index)).css({"background-image":"url('" + currentValue.product_img + "') 1x,url('" + currentValue.product_img + "') 2x"});
                    }else{
                        $("#img首页-产品0" + (++index)).css({"background-image":"url('" + currentValue.product_img + "') 1x,url('" + currentValue.product_img + "') 2x"});
                    }


                });*/

            },
            error : function() {
                confirm("异常！");
            }
        });
    });
</script>
</body>
</html>